<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Advance Automação - Registro de Quebra</title>
	<h:outputStylesheet library="css" name="style.css" />
	<meta name="viewport" content="width=device-width" />
	<style type="text/css">
body {
	background-color: #eeeeee;
}
</style>
</h:head>
<h:body>
	<!-- Container -->
	<div>
		<h:form id="formPrincipal">
			<h:panelGroup layout="block" id="dados">
				<p:chart id="chart" type="bar" model="#{eficienciaPorLinhaMBean.grafico}"
					style="height:75%; border: 1px solid;" widgetVar="barChart" rendered="#{not empty eficienciaPorLinhaMBean.listEficienciaPorLinha}"/>

				<p:panelGrid style="margin-top:0.5%; width: 100%; height: 10%;" styleClass="tabelaResponsiva" rendered="#{not empty eficienciaPorLinhaMBean.listEficienciaPorLinha}">
					<f:facet name="header">
						<p:row>
							<p:column>Equip.</p:column>
							<c:forEach var="item"
								items="#{eficienciaPorLinhaMBean.listEficienciaPorLinha}">
								<p:column>
									<h:outputText value="#{item.nome}" />
								</p:column>
							</c:forEach>
						</p:row>
					</f:facet>
					<p:row>
						<p:column styleClass="ui-widget-header" style="font-weight: bold;">GE</p:column>
						<c:forEach var="item"
							items="#{eficienciaPorLinhaMBean.listEficienciaPorLinha}">
							<p:column>
								<h:outputText value="#{item.gef}" />%</p:column>
						</c:forEach>
					</p:row>
					<p:row>
						<p:column styleClass="ui-widget-header" style="font-weight: bold;">Displays</p:column>
						<c:forEach var="item"
							items="#{eficienciaPorLinhaMBean.listEficienciaPorLinha}">
							<p:column>
								<h:outputText value="#{item.displays}" />
							</p:column>
						</c:forEach>
					</p:row>
					<p:row>
						<p:column styleClass="ui-widget-header" style="font-weight: bold;">RPM</p:column>
						<c:forEach var="item"
							items="#{eficienciaPorLinhaMBean.listEficienciaPorLinha}">
							<p:column>
								<h:outputText value="#{item.rpm}" />
							</p:column>
						</c:forEach>
					</p:row>
					<p:row>
						<p:column styleClass="ui-widget-header" style="font-weight: bold;">MTBF</p:column>
						<c:forEach var="item"
							items="#{eficienciaPorLinhaMBean.listEficienciaPorLinha}">
							<p:column>
								<h:outputText value="#{item.mtbfFormat}" />
							</p:column>
						</c:forEach>
					</p:row>
				</p:panelGrid>
			</h:panelGroup>

			<p:poll interval="40"
				listener="#{eficienciaPorLinhaMBean.atualizar()}" update="dados" />
			<div style="width: 100%; text-align: right; margin-top: 0.5%; height: 2%;">	
				<p:link href="eficienciaPorLinha.jsf">Sair do modo fullscreen</p:link>
			</div>
			<script>
			$(document).keyup(function(e) {
			  if (e.keyCode == 27) { 
				  window.location="eficienciaPorLinha.jsf"
			  }
			});
			</script>
		</h:form>
	</div>
</h:body>
</html>